<!DOCTYPE html>
<html lang="en">
 <head> 
  <meta charset="UTF-8" /> 
  <title>一见粽情</title> 
  <link rel="shortcut icon" href="logo.ico" /> 
  <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
  <script type="text/javascript">
    $(function() {
     $('input, textarea').placeholder();
    });
</script>

  <style>
        body,p,h1{padding: 0;margin: 0;}
        body{background: #fff}
        #header{width: 100%;min-width: 1024px;border-bottom: 1px solid red;height:80px;}
        .logo{width: 1024px;height: 80px;margin: 0 auto;background: url("images/loginlogo.jpg") no-repeat left 20px;text-indent: -9999em}
        .logo a{display: block;width: 268px;height: 60px;}
        #mainbody{width:100%;min-width: 1024px;margin: 0 auto;height: 465px;background: url("images/login.jpg");padding-top: 120px}
        .loginbox{height: 300px;width: 330px;position:relative;left: 60%;}
        .logintitle{height: 42px;line-height: 50px;width: 330px}
        .logintitle span{float: right;}
        .logintitle a,.automaticlogon a{text-decoration: none;color: blue;font-size: 12px;}
        .user,.password{width: 350px;height: 70px;}
        .user strong,.password strong{height: 30px;}
        .user input{background: url("images/login_yh.jpg") no-repeat 20px 12px #fff;line-height: 42px;outline: none;}
        .password input{background: url("images/login_mm.jpg") no-repeat 20px 12px #fff;line-height: 42px;outline: none;}
        .user input,.password input{height: 42px;width: 266px;padding-left: 60px;border: 2px solid #999}
        .automaticlogon{width: 330px;height: 36px;}
        .automaticlogon span{float: right}
        .signin{height: 42px;width: 330px;line-height: 42px;text-align: center}
        .signin a{color: #fff;display: block;background: brown;text-decoration: none;}
        .signin a:hover{background: red;}
        /*footer*/
        #footer{height: 100px;width: 100%;min-width: 1024px;background: #f2f2f2;margin: 0 auto;text-align: center;}
        #footer div{width: 1024px;margin: 0 auto;padding-top: 20px;}
        #footer p{height: 30px;line-height: 30px;}
        #footer a{color: #333;text-decoration: none;}
        #footer a:hover{color: red;}
    </style> 
 </head> 
 <body> 
  <div id="header"> 
   <div class="logo">
    <h1><a href="index.html" title="一见粽情">一见粽情</a></h1>
   </div> 
  </div> 
  <div id="mainbody"> 
   <div class="loginbox"> 
    <div class="logintitle">
     <strong>粽情用户登录</strong>
     <span><a href="register.html">注册新用户</a></span>
    </div> 
    <form method="post" action="index.html"> 
     <div class="user">
      <input id="yh" type="text" maxlength="12" placeholder="用户名或手机" value="" />
     </div> 
     <div class="password">
      <input type="password" maxlength="18" placeholder="请输入密码" />
     </div> 
     <div class="automaticlogon">
      <input type="checkbox" />自动登录 
      <span><a href="">忘记密码？</a></span>
     </div> 
     <div class="signin">
      <a href="index.html">登录</a>
     </div> 
    </form> 
   </div> 
  </div> 
  <div id="footer"> 
   <div> 
    <p>友情链接：<a href="http://jx.gzccc.edu.cn/" target="_blank">广州城建技工学校</a> | <a href="http://mp.weixin.qq.com/s?__biz=MzAxOTg3MDQxNQ==&mid=100000012&idx=1&sn=efb3ac860d2fe4a063eead9edefd8f96&scene=18#wechat_redirect" target="_blank">软件开发社团</a></p>
    <p>&copy;图片资源来自互联网，本站只用于网页设计活动</p> 
   </div> 
  </div> 
  <script>
        if(navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion .split(";")[1].replace(/[ ]/g,"")=="MSIE6.0" || navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion .split(";")[1].replace(/[ ]/g,"")=="MSIE7.0")
        {
            window.opener = null;
            window.open('', '_top', '');
            window.parent.close();
            window.close();
            window.open("open.html");
        };
if( !('placeholder' in document.createElement('input')) ){

    $('input[placeholder],textarea[placeholder]').each(function(){
        var that = $(this),
                text= that.attr('placeholder');
        if(that.val()===""){
            that.val(text).addClass('placeholder');
        }
        that.focus(function(){
            if(that.val()===text){
                that.val("").removeClass('placeholder');
            }
        })
                .blur(function(){
                    if(that.val()===""){
                        that.val(text).addClass('placeholder');
                    }
                })
                .closest('form').submit(function(){
            if(that.val() === text){
                that.val('');
            }
        });
    });
}
    </script>  
 </body>
</html>